<template>
  <div class="test-drag">
    <n-card title="功能测试页面" size="large">
      <n-space vertical size="large">
        
        <!-- 基本测试 -->
        <n-card title="基本功能测试" size="small">
          <n-space vertical size="small">
            <n-button @click="testBasicFunctions" type="primary">
              测试基本功能
            </n-button>
            <n-button @click="testFileDataStore" type="info">
              测试文件数据存储
            </n-button>
            <n-button @click="testWorkspaceStore" type="success">
              测试工作区存储
            </n-button>
          </n-space>
        </n-card>

        <!-- 测试结果 -->
        <n-card title="测试结果" size="small">
          <n-space vertical size="small">
            <div v-for="(result, index) in testResults" :key="index" class="test-result">
              <n-tag :type="result.success ? 'success' : 'error'" size="small">
                {{ result.success ? '成功' : '失败' }}
              </n-tag>
              <span style="margin-left: 8px;">{{ result.message }}</span>
            </div>
            <div v-if="testResults.length === 0">
              <n-text>暂无测试结果</n-text>
            </div>
          </n-space>
        </n-card>

        <!-- 手动测试 -->
        <n-card title="手动测试" size="small">
          <n-space vertical size="small">
            <n-input 
              v-model:value="testData" 
              placeholder="输入测试数据"
              type="textarea"
              :rows="3"
            />
            <n-button @click="testManualData" type="warning">
              测试手动数据
            </n-button>
          </n-space>
        </n-card>

        <!-- 状态信息 -->
        <n-card title="当前状态" size="small">
          <n-space vertical size="small">
            <div><strong>工作区数量:</strong> {{ workspaceStore.workspaces.length }}</div>
            <div><strong>当前工作区:</strong> {{ currentWorkspaceInfo }}</div>
            <div><strong>内存使用:</strong> {{ memoryUsage.totalSizeMB }} MB</div>
            <div><strong>文件数据工作区:</strong> {{ fileDataWorkspaces }}</div>
          </n-space>
        </n-card>

      </n-space>
    </n-card>
  </div>
</template>

<script setup lang="ts">
import { ref, computed, onMounted } from 'vue'
import { useWorkspaceStore } from '../stores/workspace'
import { useFileDataStore } from '../stores/fileData'

const workspaceStore = useWorkspaceStore()
const fileDataStore = useFileDataStore()

// 响应式数据
const testResults = ref<Array<{success: boolean, message: string}>>([])
const testData = ref('')

// 计算属性
const currentWorkspaceInfo = computed(() => {
  const current = workspaceStore.currentWorkspace
  if (!current) return '无'
  return `${current.name} (${current.id})`
})

const memoryUsage = computed(() => {
  return fileDataStore.getMemoryUsage()
})

const fileDataWorkspaces = computed(() => {
  const workspaces = []
  for (const [id, size] of fileDataStore.getMemoryUsage().workspaceCount) {
    workspaces.push(`${id}: ${size}`)
  }
  return workspaces.length > 0 ? workspaces.join(', ') : '无'
})

// 方法
function addTestResult(success: boolean, message: string) {
  testResults.value.push({ success, message })
  console.log(`测试结果: ${success ? '成功' : '失败'} - ${message}`)
}

function testBasicFunctions() {
  try {
    // 测试基本JavaScript功能
    const testArray = [1, 2, 3, 4, 5]
    const sum = testArray.reduce((a, b) => a + b, 0)
    
    if (sum === 15) {
      addTestResult(true, '基本JavaScript功能正常')
    } else {
      addTestResult(false, '基本JavaScript功能异常')
    }
  } catch (error) {
    addTestResult(false, `基本功能测试失败: ${error}`)
  }
}

function testFileDataStore() {
  try {
    const testWorkspaceId = 'test-workspace-123'
    const testData = '这是一个测试数据，用于验证文件数据存储功能是否正常工作。'
    
    // 测试设置数据
    fileDataStore.setFileData(testWorkspaceId, testData)
    addTestResult(true, '文件数据设置成功')
    
    // 测试获取数据
    const retrievedData = fileDataStore.getFileData(testWorkspaceId)
    if (retrievedData === testData) {
      addTestResult(true, '文件数据获取成功')
    } else {
      addTestResult(false, '文件数据获取失败')
    }
    
    // 测试删除数据
    fileDataStore.removeFileData(testWorkspaceId)
    const deletedData = fileDataStore.getFileData(testWorkspaceId)
    if (!deletedData) {
      addTestResult(true, '文件数据删除成功')
    } else {
      addTestResult(false, '文件数据删除失败')
    }
    
  } catch (error) {
    addTestResult(false, `文件数据存储测试失败: ${error}`)
  }
}

function testWorkspaceStore() {
  try {
    const testWorkspace = {
      name: '测试工作区',
      description: '这是一个测试工作区',
      type: 'test' as any,
      status: 'active' as any
    }
    
    // 测试创建工作区
    const workspace = workspaceStore.createWorkspace(testWorkspace)
    if (workspace && workspace.id) {
      addTestResult(true, '工作区创建成功')
    } else {
      addTestResult(false, '工作区创建失败')
    }
    
    // 测试设置当前工作区
    workspaceStore.setCurrentWorkspace(workspace.id)
    if (workspaceStore.currentWorkspaceId === workspace.id) {
      addTestResult(true, '当前工作区设置成功')
    } else {
      addTestResult(false, '当前工作区设置失败')
    }
    
  } catch (error) {
    addTestResult(false, `工作区存储测试失败: ${error}`)
  }
}

function testManualData() {
  if (!testData.value.trim()) {
    alert('请输入测试数据')
    return
  }
  
  try {
    const currentWorkspace = workspaceStore.currentWorkspace
    if (!currentWorkspace) {
      alert('请先选择工作区')
      return
    }
    
    // 测试手动数据
    fileDataStore.setFileData(currentWorkspace.id, testData.value)
    addTestResult(true, '手动数据设置成功')
    
    // 验证数据
    const retrievedData = fileDataStore.getFileData(currentWorkspace.id)
    if (retrievedData === testData.value) {
      addTestResult(true, '手动数据验证成功')
    } else {
      addTestResult(false, '手动数据验证失败')
    }
    
    testData.value = ''
    
  } catch (error) {
    addTestResult(false, `手动数据测试失败: ${error}`)
  }
}

// 组件挂载时运行基本测试
onMounted(() => {
  testBasicFunctions()
})
</script>

<style scoped>
.test-drag {
  padding: 20px;
  max-width: 1200px;
  margin: 0 auto;
}

.test-result {
  display: flex;
  align-items: center;
  padding: 4px 0;
}
</style> 